import 'package:flutter/material.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/services.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:videotop/base_view.dart';
import 'package:videotop/model/loginreg_model.dart';
import 'package:videotop/mycolor.dart';
import 'package:videotop/myinfo.dart';
import 'package:provider/provider.dart';

import '../util.dart';


class RegOrLogin extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return BaseView<LoginRegModel>(
      model: LoginRegModel(context,Provider.of<Util>(context),Provider.of<MyInfo>(context)),
      builder: (context,model,child){
        return AnnotatedRegion<SystemUiOverlayStyle>(
            value: SystemUiOverlayStyle.light,
            child: Scaffold(
                backgroundColor: MyColor.theme,
                resizeToAvoidBottomPadding: false,
                body: Column(
                  children: <Widget>[
                    Container(
                        padding: EdgeInsets.only(top: 150),
                        alignment: Alignment.topCenter,
                        child: Column(
                          children: <Widget>[
                            ClipRRect(
                              child: Image.asset(
                                'assets/image/ic_launcher.png',
                                height: 128,
                                width: 128,
                              ),
                              borderRadius: BorderRadius.circular(20),
                            ),
                            Container(
                              margin: EdgeInsets.only(top: 30),
                              child: Text(
                                'VideoTop',
                                style: TextStyle(
                                    letterSpacing: 4,
                                    color: Colors.white,
                                    fontFamily: 'my_bold',
                                    fontSize: 30),
                              ),
                            ),
                          ],
                        )),
                    Expanded(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.end,
                        children: <Widget>[
                          GestureDetector(
                            behavior: HitTestBehavior.opaque,
                            onTap: () {
                              model.goEmail();
                            },
                            child: Container(
                              height: 50,
                              margin:
                              EdgeInsets.only(left: 40, right: 40, top: 10),
                              decoration: BoxDecoration(
                                  borderRadius: BorderRadius.circular((10)),
                                  color: MyColor.yellow),
                              child: Stack(
                                children: <Widget>[
                                  Align(
                                      alignment: Alignment.centerLeft,
                                      child: Container(
                                        margin: EdgeInsets.only(left: 30),
                                        child: Image.asset(
                                          'assets/image/email.png',
                                          height: 24,
                                          width: 24,
                                        ),
                                      )),
                                  Center(
                                    child: Text(
                                      'Sign in with Email',
                                      style: TextStyle(
                                        fontSize: 15,
                                        color: Colors.white,
                                      ),
                                    ),
                                  )
                                ],
                              ),
                            ),
                          ),
                          GestureDetector(
                            behavior: HitTestBehavior.opaque,
                            onTap: () {
                              model.applelogIn();
                            },
                            child: Container(
                              height: 50,
                              margin: EdgeInsets.only(left: 40,right: 40,top: 10),
                              decoration: BoxDecoration(
                                  borderRadius: BorderRadius.circular((10)),
                                  color: Colors.white
                              ),
                              child: Stack(
                                children: <Widget>[
                                  Align(
                                      alignment: Alignment.centerLeft,
                                      child: Container(
                                          margin: EdgeInsets.only(left: 30),
                                          child: Icon(
                                            FontAwesomeIcons.apple,
                                            size: 26,
                                            color: Colors.black,
                                          )
                                      )),
                                  Center(
                                    child: Text(
                                      'Sign in with Apple',
                                      style: TextStyle(
                                          fontFamily: 'my_medium',
                                          fontSize: 15,
                                          color: Colors.black),
                                    ),
                                  ),
                                ],
                              ),
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.only(top: 20),
                            child: Text(
                              'By tapping Log In, you agree with our',
                              style: TextStyle(
                                fontSize: 12,
                                fontFamily: 'my_regular',
                                color: Colors.white,
                              ),
                            ),
                          ),
                          Container(
                            padding: EdgeInsets.only(
                                left: 30, right: 30),
                            child: RichText(
                              text: TextSpan(children: <TextSpan>[
                                TextSpan(
                                    text: 'Terms of Service',
                                    style: TextStyle(
                                        fontSize: 12,
                                        fontFamily: 'my_regular',
                                        color: Colors.white,
                                        decoration: TextDecoration.underline),
                                    recognizer: new TapGestureRecognizer()
                                      ..onTap = () async {
                                        context.read<Util>().goTerms();
                                      }),
                                TextSpan(
                                  text: '   ',
                                  style: TextStyle(
                                    fontSize: 12,
                                    fontFamily: 'my_regular',
                                    color: Colors.white,
                                  ),
                                ),
                                TextSpan(
                                    text: 'Privacy Policy',
                                    style: TextStyle(
                                        fontSize: 12,
                                        fontFamily: 'my_regular',
                                        color: Colors.white,
                                        decoration: TextDecoration.underline),
                                    recognizer: new TapGestureRecognizer()
                                      ..onTap = () async {
                                        context.read<Util>().goPrivacy();
                                      }),
                              ]),
                            ),
                          ),
                          SizedBox(
                            height: 60,
                          )
                        ],
                      ),
                    )
                  ],
                )));
      },
    );
  }

}
